<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>转交下一步</title>
    <link rel="stylesheet" href="../lib/css/style.css">
    <link rel="stylesheet" href="../lib/bpm/jquery.tags-revisited.css">
    <link rel="stylesheet" href="../lib/css/ins.css">
    <link rel="stylesheet" href="../lib/font/css/font-awesome.min.css">
    <script>
        function getParam(name, url) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
            if (url) {
                var r = url.substr(1).match(reg);
            } else {
                var r = window.location.search.substr(1).match(reg);
            }
            if (r != null) return r[2];
            return '';
        }
    </script>
    <style>
        .checked {
            color: #0e90d2;
        }

        .fa-bell, .fa-envelope {
            cursor: pointer;
        }

        .fa {
            font-size: 18px;
        }

        body {
            padding-left: 10px;
            padding-right: 10px;
            padding-top: 10px;
        }

        .next-step {
            width: 200px;
            height: 30px;
            line-height: 30px;
            padding-left: 10px;
            vertical-align: middle;
            position: relative;
            overflow: hidden;
        }

        .next-step input {
            position: relative;
            z-index: 2;
        }

        .bg {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 1;
            padding-left: 25px;
        }

        input:checked + .bg {
            background: #337ab7;
            color: white;
        }

    </style>
    <script src="../lib/jquery/jquery.js"></script>
    <script src="../lib/vue/vue.js"></script>
    <script src="../lib/layer/layer.js"></script>

</head>
<body>
<div id="app">
    <div class="panel panel-default">
        <div class="panel-heading">
            当前步骤为[{{current.nodeName}}]
            <font color="red">
                <div self_type="self" style="display:inline;">{{Object.values(current.mainUsers)}}</div>
                <div style="display:inline;">{{ins.state}}</div>
            </font>
        </div>
    </div>

    <div class="panel panel-default">
        <div class="panel-heading">
            请选择下一步骤<span v-if="forceConCurrent" style="margin-left: 20px;color: #ff0000;font-style:italic;">此步骤为强制并发</span>
        </div>
        <div class="panel-body">
            <table width="100%">
                <tr>
                    <td width="200" style=" " valign="top">
                        <label v-for="(v,i) in (zheng.next||[])" class="next-step" :data-id="v.nodeId" >
                            <input type="checkbox" v-model="data.nodeIds" :value="v.nodeId" :disabled="zheng.forceConCurrent">
                            <div class="bg">
                                {{v.nodeName}}
                                <span v-if="v.allowDynamic">
                                    【动态并发】
                                </span>
                            </div>
                        </label>
                    </td>

                    <td >
                        <div class="next-step-item" v-for="(v,i) in (zheng.next || [])" v-show="v.selected" :data-id="v.nodeId">
                            <div style="margin-left: 20px;overflow: auto;min-height: 40px;max-height: 70px" v-if="hasMainUsers(v)">主办人：
                                {{Object.values(v.mainUsers).join(",")}}
                            </div>
                            <div style="margin-left: 20px;overflow: auto;min-height: 150px;max-height: 1px">
                                <div >
                                    经办人：
                                    <textarea readonly cols="50" rows="3" :value="formatOperators(v)"></textarea>
                                </div>
                                <a href="javascript:;" id="sel" @click="selUser(v)" class="btn btn-primary btn-sm">选择人员</a>
                                <a href="javascript:;" id="clean-sel" @click="cleanUsers(v)">清空</a>
                            </div>
                        </div>
                    </td>
                </tr>
            </table>
        </div>
    </div>

    <!--    <div style="margin:5px;" id="work-choose-next">-->
    <!--        <div class="work-prcs-title">请选择下一步骤</div>-->

    <!--        &lt;!&ndash;<div style="display: flex; flex-direction: row">&ndash;&gt;-->
    <!--            &lt;!&ndash;<ul id="selectTaskName" style="width: 150px;">&ndash;&gt;-->
    <!--            &lt;!&ndash;<li class='selectedCss'>节点名</li>&ndash;&gt;-->
    <!--            &lt;!&ndash;<li>节点2</li>&ndash;&gt;-->
    <!--            &lt;!&ndash;</ul>&ndash;&gt;-->
    <!--            &lt;!&ndash;<div style="flex: 1;">&ndash;&gt;-->
    <!--                &lt;!&ndash;<button id="chooseUser" class="btn btn-primary">选择人员</button>&ndash;&gt;-->
    <!--                &lt;!&ndash;<div id="mainUser" class="tagsinput" style="width: auto; min-height: auto; height: auto;">主办人&ndash;&gt;-->
    <!--                &lt;!&ndash;</div>&ndash;&gt;-->
    <!--            &lt;!&ndash;</div>&ndash;&gt;-->
    <!--            &lt;!&ndash;<div style="flex: 2; background: pink;">12332131312312</div>&ndash;&gt;-->
    <!--        &lt;!&ndash;</div>&ndash;&gt;-->

    <!--        &lt;!&ndash;<div style="position: relative;">&ndash;&gt;-->
    <!--            &lt;!&ndash;<div style="margin: 15px" class="work-main-left">&ndash;&gt;-->
    <!--                &lt;!&ndash;<ul id="selectTaskName">&ndash;&gt;-->
    <!--                    &lt;!&ndash;<li class='selectedCss'>节点名</li>&ndash;&gt;-->
    <!--                    &lt;!&ndash;<li>节点2</li>&ndash;&gt;-->
    <!--                &lt;!&ndash;</ul>&ndash;&gt;-->
    <!--                &lt;!&ndash;&lt;!&ndash;<input type="checkbox" checked>节点&ndash;&gt;&ndash;&gt;-->
    <!--            &lt;!&ndash;</div>&ndash;&gt;-->
    <!--            &lt;!&ndash;<div class="work-prcs-content clearfix" class="work-main-right" style="position: absolute;left: 150px;top: 0;right: 0;">&ndash;&gt;-->
    <!--                &lt;!&ndash;&lt;!&ndash;<div id="step"></div>&ndash;&gt;&ndash;&gt;-->
    <!--                &lt;!&ndash;<button id="chooseUser" class="btn btn-primary">选择人员</button>&ndash;&gt;-->
    <!--                &lt;!&ndash;<div id="mainUser" class="tagsinput" style="width: auto; min-height: auto; height: auto;">主办人&ndash;&gt;-->
    <!--                &lt;!&ndash;</div>&ndash;&gt;-->
    <!--            &lt;!&ndash;</div>&ndash;&gt;-->
    <!--        &lt;!&ndash;</div>&ndash;&gt;-->

    <!--    </div>-->
    <div class="panel panel-default">
        <div class="panel-heading">
            向以下人员发送事务提醒消息
        </div>
        <div class="panel-body">
            <div class="work-msg-op-title">下一步骤：
                <i class="fa fa-bell" style="color: #337ab7;"aria-hidden="true" title="发送站内信"
                   @click="data.nextStepNotice = !data.nextStepNotice"></i>
                <i class="fa fa-envelope" :class="{checked: data.nextStepShort}" aria-hidden="true" title="发送短信"
                   @click="data.nextStepShort = !data.nextStepShort"></i>
            </div>
            <div class="work-msg-op-title">发起人：
                <i class="fa fa-bell" aria-hidden="true" title="发送站内信" :class="{checked: data.startNotice}"
                   @click="data.startNotice = !data.startNotice"></i>
                <i class="fa fa-envelope" aria-hidden="true" title="发送短信" :class="{checked: data.startShort}"
                   @click="data.startShort = !data.startShort"></i>
            </div>
            <div class="work-msg-op-title">全部经办人：
                <i class="fa fa-bell" aria-hidden="true" title="发送站内信" :class="{checked: data.allNotice}"
                   @click="data.allNotice = !data.allNotice"></i>
                <i class="fa fa-envelope" aria-hidden="true" title="发送短信" :class="{checked: data.allShort}"
                   @click="data.allShort = !data.allShort"></i>
            </div>

            <hr style="clear: both; margin-top: 10px;margin-bottom: 10px;">

            <table width="100%">
                <tr>
                    <td width="150">提醒指定步骤经办人：</td>
                    <td>
                        <textarea readonly cols="50" rows="3">{{remindAgentfn}}</textarea>
                        <!--<textarea readonly name="" v-model="reUserName" id="reUserName" cols="50" rows="3"></textarea>-->
                    </td>
                    <td style="padding-left: 1px">
                        <a href="javascript:;"id="selectUser" @click="selectUser()">选择</a>
                        <a href="javascript:;" id="clean-select" @click="cleanUser()">清空</a>
                    </td>
                </tr>
            </table>

            <hr style="clear: both; margin-top: 10px;margin-bottom: 10px;">

            <table width="100%">
                <tr>
                    <td width="80">
                        提醒内容：
                    </td>
                    <td>
                        <!--<input type="text" v-model="data.message" class="form-control input-sm" id="modelName"-->
                               <!--name="modelName" :placeholder="'您有新的工作需要办理，流程id：' + ins.id + '，流程：' + ins.bpmName">-->
                        <input type="text" v-model="data.message" class="form-control input-sm" id="modelName"
                               name="modelName">
                    </td>
                </tr>
            </table>
        </div>
    </div>
    <!--    <div style="margin:5px;border: 1px solid #d0d0d0; margin-top: 15px;">-->
    <!--        <div class="work-msg-title" style="border: 0; border-bottom: 1px solid #ddd">向以下人员发送事务提醒消息</div>-->
    <!--        <div class="work-msg-content" style="display: block; border: 0; border-bottom: 1px solid #ddd;">-->
    <!--            <div class="clearfix">-->
    <!--                <div class="work-msg-op-title">下一步骤：-->
    <!--                    <i class="fa fa-bell checked" aria-hidden="true" title="发送站内信"></i>-->
    <!--                    <i class="fa fa-envelope" aria-hidden="true" title="发送短信"></i>-->
    <!--                </div>-->
    <!--                <div class="work-msg-op-title">发起人：-->
    <!--                    <i class="fa fa-bell" aria-hidden="true" title="发送站内信"></i>-->
    <!--                    <i class="fa fa-envelope" aria-hidden="true" title="发送短信"></i>-->
    <!--                </div>-->
    <!--                <div class="work-msg-op-title">全部经办人：-->
    <!--                    <i class="fa fa-bell" aria-hidden="true" title="发送站内信"></i>-->
    <!--                    <i class="fa fa-envelope" aria-hidden="true" title="发送短信"></i>-->
    <!--                </div>-->
    <!--            </div>-->
    <!--        </div>-->
    <!--        <div class="clearfix" style="margin-left: 15px">-->
    <!--            提醒指定步骤经办人：-->
    <!--            <button id="chooseMsg" class="btn btn-primary">选择人员</button>-->
    <!--            <div id="msgUser" class="tagsinput" style="width: auto; min-height: auto; height: auto;">-->
    <!--            </div>-->
    <!--        </div>-->
    <!--        <div class="work-msg-sms-block">-->
    <!--            <label for="modelName" class="col-xs-3 text-left">-->
    <!--                提醒内容：-->
    <!--            </label>-->
    <!--            <div class="col-xs-8" style="padding-right: 15px;-->
    <!--                        padding-left: 15px; max-width:400px">-->
    <!--                <input type="text" class="form-control input-sm" id="modelName" name="modelName" value="您有新的工作需要办理">-->

    <!--            </div>-->
    <!--        </div>-->
    <!--    </div>-->
    <div style="text-align: center; padding-top: 20px;">
        <a href="javascript:;" id="submit" @click="submit()" class="btn btn-primary btn-sm">确定</a>
    </div>
</div>


<!--<div id="content">-->
<!--<div style="width: 500px;margin: 0 auto;">-->
<!--<ul id="ulist" style="height: 200px; overflow: auto;margin: 0 auto;">-->
<!--</ul>-->
<!--<div style="text-align: center; padding-top: 20px;">-->
<!--<a href="javascript:;" id="submit">确定</a>-->
<!--</div>-->
<!--</div>-->
<!--</div>-->
</body>
</html>
<script>
    var id = getParam("id");
    var logId = getParam("logId");
    layer.load(0, {time: 5000})

    function getData() {
        try{
            if (opener && opener.app) {
                console.log(opener.app,">>>>>>>>>",opener.app.getData())
                return (opener.app.getData())
            }
        } catch (e) {
        }
        return {};
    }


    // $("#chooseUser").click(function () {
    //     var opener = window.open("./choose.html?id=" + id, "choosepersons", "top=100, left=100, width=500, height=300")
    //     opener.onload = function () {
    //         var _$ = document.querySelector.bind(opener.document);
    //         _$('#submit').onclick = function (e) {
    //             $("#mainUser").append("<span id='"+window.userId+"' class='tag'><span class='tag-text'>"+window.userId+"</span><button class='tag-remove' id='remove'></button></span>");
    //         }
    //     }
    // })

    // $("#chooseMsg").click(function () {
    //     var opener = window.open("./msg.choose.html?id=" + id, "msgchoosepersons", "top=100, left=100, width=500, height=300")
    //     opener.onload = function () {
    //         var _$ = document.querySelector.bind(opener.document);
    //         _$('#submit').onclick = function (e) {
    //             for(var i in window.msgUser){
    //                 alert(window.msgUser[i])
    //             }
    //
    //             $("#msgUser").append("<span id='"+window.msgUser+"' class='tag'><span class='tag-text'>"+window.userId+"</span><button class='tag-remove' id='remove'></button></span>");
    //         }
    //     }
    // });

    window.sponsor = "";


    var app = new Vue({
        el: "#app",
        data: {
            nodes: [],
            current: {
                unames: []
            },
            ins: {},
            data: {
                id: id,
                nodeIds: [],
                uids: "",
                nextStepNotice: true,
                nextStepShort: false,
                startNotice: false,
                startShort: false,
                allNotice: false,
                allShort: false,
                message: ""
            },
            reUserName:[],
            agent:{},   //下一步骤 经办人
            mainSponsor:{},   //下一步骤 主办人
            remindAgent:{},   //提醒指定经办人
            nextNodes:{},      // 一个节点上有多个审批节点
            nextNodesMainUid:{},
            selectUserList:{},   // 选人页面值
            msgTemp:"",
            isMainUid:false,
            canChangeAgent:true, // 是否允许更改经办人
            nextNodesCanChanage:{},
            concurrent:false,   // 是否可以并发
            concurrentAllNode:{},  //并发所有节点集合
            concurrentNode:{},  // 并发选中节点
            currentNodeId:"",   // 并发当前处理节点
            conCurrentMainUid:{},   // 允许动态并发
            logs:[], // 是否可选择人员，一般为并发时有效
            forceConCurrent:false, //强制并发

            zheng: {}
        },

        computed:{
            sponsorfn: function(){
                return Object.values(this.mainSponsor).join(",")
            },
            agentfn: function(){
                return Object.values(this.agent).join(",")
            },

            // 合并 主办人
            conSponsorfn: function(){
                return Object.values(this.mainSponsor).join(",")
            },
            conAgentfn: function(){

                /*return function (res) {
                    console.log("------")
                    return Object.values(this.agent).join(",");
                }*/
                // console.log("lllllllllllllll",this.agent)
                return Object.values(this.agent).join(",")
            },

            remindAgentfn: function(){
                return Object.values(this.remindAgent).join(",")
            },
            // changeMessage: function () {
            //         return this.message =this.msgTemp;
                //     if(this.data.nodeIds[0] && this.data.nodeIds[0].indexOf("EndEvent") != -1){
                //         return this.message = "您参与的流程已办结，流程id：" + this.ins.id + "，流程：" + this.ins.bpmName;
                //     }else{
                //         return this.message = "您有新的工作需要办理，流程id：" + this.ins.id + "，流程：" + this.ins.bpmName;
                //     }
                // return null;
            // },
            // 如果watch监测的是一个对象的话，直接使用watch是不行的，需要借助于computed计算属性来完成
            newNodeIds: function(){
                return this.data.nodeIds;
            }
        },
        watch:{
            "data.nodeIds": function(nv, ov){
                Array.prototype.minus = function (arr) {
                    var result = new Array();
                    var obj = {};
                    for (var i = 0; i < arr.length; i++) {
                        obj[arr[i]] = 1;
                    }
                    for (var j = 0; j < this.length; j++) {
                        if (!obj[this[j]])
                        {
                            obj[this[j]] = 1;
                            result.push(this[j]);
                        }
                    }
                    return result;
                };

                //从有到无
                ;(this.zheng.next || []).forEach(function (next) {
                    Vue.set(next, "selected", nv && nv.indexOf(next.nodeId) > -1);
                });
                var t = this;
                if(nv.length < this.zheng.min){
                    t.$nextTick(function () {
                        t.data.nodeIds = [ov[0]];
                    });
                }
                if(nv.length > this.zheng.max){
                    if(nv.length > ov.length){
                        var reduce = nv.minus(ov);
                        if(reduce.length){
                            t.$nextTick(function () {
                                t.data.nodeIds = [reduce[0]];
                            });
                        }
                    }
                }

                // if(!nv || !nv.length ){
                //     if(ov && ov.length){
                //         t.$nextTick(function () {
                //             t.data.nodeIds = [ov[0]];
                //         });
                //     }
                // }
                // console.log(this.zheng.next)
            },
            /**
            // 下一步骤选择
            newNodeIds: function(nv,ov){
                if(true){
                    return
                }
                console.log(nv,ov)
                // if(Object.getOwnPropertyNames(this.nextNodes).length<=2){
                //     return
                // }

                // 并发的情况
                if(this.concurrent){
                    this.concurrentNode = {}

                    for(var i=0;i<nv.length;i++){
                        var node = this.concurrentAllNode[nv[i]];
                        var n = [];
                        // 是否有主办人
                        var muid = this.conCurrentMainUid[nv[i]];
                        n.push({"node":node,"isMainUid":muid});
                        this.concurrentNode[nv[i]] = n;

                        var nn = this.nextNodes[nv[i]];
                        if(!$.isEmptyObject(nn)){
                            // 如果节点明确指定主办人
                            if(muid){
                                Vue.set(app.mainSponsor, nv[i],{});
                                if(nn[0]){
                                    // 默认为第一个
                                    var main = {}
                                    main[nn[0].uid] = nn[0].utname;
                                    Vue.set(app.mainSponsor, nv[i],main);

                                }else{
                                    app.$data.mainSponsor = {}
                                    Vue.set(app.mainSponsor, nv[i], "该节点无主办人")
                                }
                            }


                            // 经办人默认全勾选
                            Vue.set(app.agent, nv[i],{});
                            var ag = {};
                            for(var j=0;j<nn.length;j++){
                                // 有主办人，并且为第一个时不选中
                                if(j == 0 && muid){
                                    continue;
                                }
                                ag[nn[j].uid] = nn[j].utname;
                            }
                            Vue.set(app.agent, nv[i],ag);

                        }else{
                            // 主办人
                            app.$data.mainSponsor = {}
                            Vue.set(app.$data.mainSponsor, nv[i], "该节点无主办人")
                            // 经办人
                            app.$data.agent = {}
                        }
                    }
                    return;
                }


                if(nv.length > ov.length){
                    var last = nv[nv.length - 1]
                    this.data.nodeIds = [last];
                    this.selectUserList = {};

                    var nn = this.nextNodes[last];
                    var muid = this.nextNodesMainUid[last];
                    this.canChangeAgent = this.nextNodesCanChanage[last];
                    this.isMainUid = muid


                    // if(muid){
                    // }
                    if(!$.isEmptyObject(nn)){
                        this.selectUserList = nn;
                        // $.each(nn,function (e) {
                        //     // this.mainSponsor = {}
                        // })
                        if(nn[0]){
                            // 合并节点 有logs时
                            if(app.$data.logs.length>0 && app.$data.logs[0]){
                                app.$data.mainSponsor = {}
                                app.$data.mainSponagentsor = {}
                                var main = app.$data.logs[0].backup["mainUsers"];
                                var agent = app.$data.logs[0].backup["supportUsers"];

                                $.each(main,function (i, v) {
                                    console.log(i,v)
                                    Vue.set(app.$data.mainSponsor, i,v)
                                })
                                $.each(agent,function (i, v) {
                                    console.log(i,v)
                                    Vue.set(app.$data.agent, i,v)
                                })
                                return;

                            }else{
                                // 默认为第一个
                                app.$data.mainSponsor = {}
                                Vue.set(app.$data.mainSponsor, nn[0].uid, nn[0].utname)
                            }
                        }else{
                            app.$data.mainSponsor = {}
                            Vue.set(app.$data.mainSponsor, "", "该节点无主办人")
                        }
                        // 经办人默认全勾选
                        app.$data.agent = {}
                        for(var i=0;i<nn.length;i++){
                            // 有主办人，并且为第一个时不选中
                            if(i == 0 && this.isMainUid){
                                continue;
                            }
                            Vue.set(app.$data.agent, nn[i].uid, nn[i].utname)
                        }
                    }else{
                        // 主办人
                        app.$data.mainSponsor = {}
                        Vue.set(app.$data.mainSponsor, "", "该节点无主办人")
                        // layer.msg("该节点无主办人")
                        // 经办人
                        app.$data.agent = {}
                    }
                    // Vue.set(this, "data.nodeIds", [last])
                }else if(nv.length > ov.length){
                    this.data.nodeIds = [];
                    // Vue.set(this, "data.nodeIds", [])
                }
            }
            **/
        },
        methods: {
            submit: function () {
                console.log(app.$data.mainSponsor,app.$data.agent)
                var d = app.$data.data;
                d.bpmId = app.$data.ins.id;
                d.bpmName = app.$data.ins.bpmName;
                // if (!d.message) {
                //     d.message = app.$data.msgTemp;
                //     // if(d.nodeIds[0] && d.nodeIds[0].indexOf("EndEvent") != -1){
                //     //     d.message = "您参与的流程已办结，流程id：" + app.$data.ins.id + "，流程：" + app.$data.ins.bpmName;
                //     // }else{
                //     //
                //     //     d.message = "您有新的工作需要办理，流程id：" + app.$data.ins.id + "，流程：" + app.$data.ins.bpmName;
                //     // }
                // }
                // // if(d.uids == undefined || d.uids.length<0){
                // //     layer.msg("请选择下一步人员")
                // //     return;
                // // }

                var _data = getData();
                d.data = _data.data
                d.files = _data.files
                d.sign = _data.sign

                var t = app.$data;

                // 并发的情况
                /*d.nextNodeIds = {};
                $.each(t.concurrentNode,function (i, v) {
                    console.log(i,v)
                    $.each(t.agent,function (ai, av) {
                        if(v[0] && v[0].isMainUid){
                            $.each(t.mainSponsor,function (mi, mv) {
                                if(mi === ai){
                                    console.log("0000000",mi,mv,ai,av)
                                    var dealUser = {"mainUser":mv,"agentUser":av};
                                    // dealUser.push({"mainUser":mv,"agentUser":av})
                                    d.nextNodeIds[mi] = dealUser;
                                }
                            })
                        }

                    })
                })*/

                d.mainList = t.mainSponsor;
                d.agentList = t.agent;
                d.concurrent = t.concurrent;

                // d.sponsor = window.sponsor;   // 主办人

                // 主办人
                // d.uids = "";
                // if(app.$data.isMainUid){
                //     if(!$.isEmptyObject(app.$data.mainSponsor)){
                //         $.each(app.$data.mainSponsor,function (i, item) {
                //             d.uids = i;
                //         })
                //     }
                // }
                // 下一步骤 经办人
                var agent = [];
                $.each(app.$data.agent,function (i, item) {
                    agent.push(i);
                })
                d.agent = agent;        //下一步骤 经办人
                // d.reUser = window.users;    // 提醒指定步骤经办人
                // 提醒指定步骤经办人
                var remindAgent = [];
                $.each(app.$data.remindAgent,function (i, item) {
                    remindAgent.push(i);
                })
                d.reUser = remindAgent;


                var map = d.nextNodes = {};
                t.zheng.next.forEach(function (e) {
                    if(!e.selected){
                        return
                    }
                    map[e.nodeId] = {
                        mainUsers: Object.keys(e.mainUsers),
                        supportUsers: Object.keys(e.supportUsers),
                    }
                });

                // 节点id
                // if(opener.app.$data.isConcurrent){
                //     d.nodeId = opener.app.$data.dealNode;
                // }else{
                //     d.nodeId = app.$data.current.nodeId;
                // }
                d.logId = logId;

                $.ajax({
                    url: "/api/bpm/workflow/nextApprover",
                    type: "post",
                    headers: {
                        "Content-Type": "application/json"
                    },
                    dataType: "json",
                    data: JSON.stringify(d),
                    success: function (msg) {
                        if (!msg.success) {
                            layer.msg("提交失败！" + msg.errMessage);
                            return;
                        }

                       if(msg.data.end){
                           opener.layer.msg('提交成功，流程已办结');
                       }  else {
                           opener.layer.msg("提交成功！");
                       }

                        if(opener.app){
                            opener.app.type = 'deal';
                            opener.app.id = id;
                            opener.app.load();
                            // opener.app.canDeal();
                        }
                        // window.opener.load("deal", id);
                        // opener.type = "deal";
                        // opener.id = id;
                        window.opener.scrollTo(0, 0);
                        window.close();

                        // if(d.nodeIds[0] && d.nodeIds[0].indexOf("EndEvent") != -1 ){
                        //     window.opener.layer.msg(msg.data);
                        // }else{
                        //     window.opener.layer.msg("提交成功！");
                        // }
                        // if(opener.app){
                        //     opener.app.type = 'deal';
                        //     opener.app.id = id;
                        //     opener.app.load();
                        // }
                        // // window.opener.load("deal", id);
                        // // opener.type = "deal";
                        // // opener.id = id;
                        // window.opener.scrollTo(0, 0);
                        // window.close();
                    }
                    // complete: function () {
                    //     layer.close
                    // }
                })
            },
            format:function(nodeId){
                console.log("agent",this.agent[nodeId])
                return Object.values( this.agent[nodeId] || {}).join(",");
            },
            formatSponsor:function(nodeId){
                console.log("mainSponsor$$",this.mainSponsor[nodeId])
                return "该节点无主办人" == this.mainSponsor[nodeId] ? this.mainSponsor[nodeId] :Object.values( this.mainSponsor[nodeId] || {}).join(",");
            },

            onNodeChecked: function (item) {
                // this.data.nodeIds = [item.nodeId];
                // console.log(this.data.nodeIds)
            },
            selectUser :function () {
                // layer.msg("开发中");
                // return;
                window.open("./agent.select.html?id=" + id, "userSelect", "top=100, left=100, width=500, height=300")
            },
            cleanUser:function () {
                app.$data.reUserName = [];
                window.users = [];
                app.$data.remindAgent = {};
            },
            sel:function () {
                if(!app.$data.canChangeAgent){
                    layer.msg("该步骤不允许更改经办人");
                    return;
                }
                if(app.$data.logs.length>0){
                    layer.msg("您无权更改此步骤默认人员");
                    return;
                }

                 window.open("./next.select.html?id=" + id+"&sponsor="+window.sponsor, "userSelect", "top=100, left=100, width=500, height=300")
                // console.log(win)
                // win.document.body.onload = function(){
                //     win.abc()
                // }
            },
            cleanSel:function(){
                if(!app.$data.canChangeAgent){
                    layer.msg("该步骤不允许更改经办人");
                    return;
                }
                if(app.$data.logs.length>0){
                    layer.msg("您无权更改此步骤默认人员");
                    return;
                }
                window.sponsor = "";
                // app.$data.mainSponsor = {};
                app.$data.agent = {};
            },
            // conSel:function (nodeId) {
            //     if(!app.$data.nextNodesCanChanage[nodeId]){
            //         layer.msg("该步骤不允许更改经办人");
            //         return;
            //     }
            //     this.currentNodeId = nodeId;
            //     window.open("./next.select.html?id=" + id+"&sponsor="+window.sponsor+"&nodeId="+nodeId, "userSelect", "top=100, left=100, width=500, height=300")
            // },
            // conCleanSel:function(nodeId){
            //     if(!app.$data.nextNodesCanChanage[nodeId]){
            //         layer.msg("该步骤不允许更改经办人");
            //         return;
            //     }
            //     app.$data.agent[nodeId] = {};
            // },




            /********************/
            init: function(data){
                Vue.set(this, "zheng", data);
                var t = this;

                data.min = 1;
                data.max = 1;

                data.next = data.next || [];
                //初始化人员
                data.next.forEach(function (e) {
                    Vue.set(e, "mainUsers", {});
                    Vue.set(e, "supportUsers", {});
                    Vue.set(e, "selected", false);
                    var i = 0;
                    //有主办人
                    if(t.hasMainUsers(e)){
                        var item = e.dealers[i++];
                        if(item){
                            Vue.set(e.mainUsers, item.uid, item.utname);
                        }
                    }
                    for(; i < e.dealers.length; i++){
                        var ee = e.dealers[i];
                        Vue.set(e.supportUsers, ee.uid, ee.utname);
                    }
                });

                if(!data.next.length){
                    layer.msg("无可用的节点，请检查配置");
                    throw new Error();
                }

                if(data.concurrent){
                    //如果是并发节点，默认全部勾上
                    this.data.nodeIds = data.next.map(function (e) {
                        return e.nodeId;
                    });
                    data.max = 100;
                } else {
                   //默认勾上第一个
                    this.data.nodeIds = [data.next[0].nodeId];
                    data.max = 1;
                }

            },
            hasMainUsers(v){
                return v.isMainUid && !v.allowDynamic;
            },
            formatOperators: function(v){
                console.log(v);
                return Object.values(v.supportUsers).join(",");
            },

            selUser: function (v) {
                if(!v.canChangeAgent){
                    return layer.msg("该步骤不允许更改经办人");
                }
                window.onChooseInit = function(){
                    return {
                        all: v.dealers,
                        supportUsers: v.supportUsers || {},
                        mainUsers: v.mainUsers || {}
                    }
                };
                window.onChooseCallback = function(data){
                    Vue.set(v, "supportUsers", data.supportUsers)
                    Vue.set(v, "mainUsers", data.mainUsers)
                }
                window.open("./next.select.html?id=" + id+"&sponsor="+window.sponsor, "userSelect", "top=100, left=100, width=500, height=300")
            },
            cleanUsers: function (v) {
                if(!v.canChangeAgent){
                    return layer.msg("该步骤不允许更改经办人");
                }
                Vue.set(v, "supportUsers", {});
            }
        },
        created: function () {
            var allData = opener.app.data.attrs;
            var _data = getData().data;
            var t = this;
            var _current = opener.app.data.current;
            $.ajax({
                url: "/api/bpm/workflow/getNextDealers",
                type:"post",
                headers:{
                    "Content-Type": "application/json"
                },
                data: JSON.stringify({id: id, logId: logId}),
                success: function (msg) {
                    // $("#ulist").html(tmpl({
                    //     data: msg.data
                    // }));
                    layer.closeAll();
                    if (msg.success) {
                        t.init(msg.data)

                        t.nodes = msg.data.next;
                        t.current = msg.data.node;
                        t.ins = msg.data.ins;
                        t.msgTemp = msg.data.msgTemp;
                        t.concurrent = msg.data.concurrent;
                        t.forceConCurrent = msg.data.forceConCurrent;


                        t.msgTemp = (t.msgTemp || "").replace(/\[\s*(.+?)\s*\]/g, function (a,b) {
                            switch (b) {
                                case "流水号":
                                    return t.ins.id;
                                case "流程名":
                                    return t.ins.bpmName;
                                default:
                                        return _data[b] || allData[b] || ""
                            }
                        })
                        t.data.message = t.msgTemp;












                        /**



                        // if (t.nodes && t.nodes.length == 1 && t.nodes[0].dealers && t.nodes[0].dealers[0]) {
                        if(t.nodes[0].dealers.length<=0 && t.nodes[0].nodeId){
                            t.data.nodeIds = [t.nodes[0].nodeId]
                            // layer.msg("该节点无主办人")
                            // app.$data.mainSponsor = {}
                            Vue.set(app.$data.mainSponsor, "", "该节点无主办人")
                        }

                        if (msg.data && t.nodes  && t.nodes[0].dealers ) {
                            for(var i in msg.data.next){
                                t.nextNodes[msg.data.next[i].nodeId] = msg.data.next[i].dealers
                                // 主办人默认为第一个
                                if($.isEmptyObject(t.mainSponsor) && msg.data.next[i].dealers && msg.data.next[i].dealers[0]){
                                    // todo 注释
                                    // Vue.set(t.mainSponsor, msg.data.next[i].dealers[0].uid, [msg.data.next[i].dealers[0].utname])
                                    // 经办人默认全勾选
                                    // for(var j in  msg.data.next[i].dealers){
                                    //     if(0 == j){
                                    //         continue;
                                    //     }
                                    //     Vue.set(t.agent, msg.data.next[i].dealers[j].uid, [msg.data.next[i].dealers[j].utname])
                                    // }
                                }
                            }



                            // 并发时，初始化全部节点选中
                            if(t.concurrent){
                                t.data.nodeIds = [];
                                t.selectUserList = {};

                                for(var i =0;i<t.nodes.length;i++){
                                    t.data.nodeIds.push(t.nodes[i].nodeId);
                                    t.selectUserList[t.nodes[i].nodeId] = t.nextNodes[t.nodes[i].nodeId]
                                }
                            }else{
                                t.data.nodeIds = [];
                                t.selectUserList = {};
                                // 操作数据就是操作视图
                                t.data.nodeIds = [t.nodes[0].nodeId]
                                if(t.nodes[0].dealers[0]){
                                    t.data.uids = t.nodes[0].dealers[0].uid
                                }else{
                                    t.data.uids = "";
                                }

                                t.selectUserList[t.data.nodeIds] = t.nextNodes[t.data.nodeIds];
                            }
                        }
                        if(msg.data.next){
                            for(var i=0;i<msg.data.next.length;i++){
                                t.nextNodesMainUid[msg.data.next[i].nodeId] = msg.data.next[i].isMainUid;
                                // 是否允许动态并发
                                if(msg.data.allowDynamic){
                                    t.conCurrentMainUid[msg.data.next[i].nodeId] = msg.data.next[i].isMainUid;
                                }
                                t.nextNodesCanChanage[msg.data.next[i].nodeId] = msg.data.next[i].canChangeAgent;
                                t.concurrentAllNode[msg.data.next[i].nodeId] = msg.data.next[i].nodeName;

                            }



                            // 合并节点
                            t.logs = msg.data.next[0].logs;

                        }
                        **/
                    } else {
                        layer.msg(msg.errMessage)
                    }
                }
            })
        }
    });

    // $(document).on("click", "label.next-step", function () {
    //     if(!$(this).is("label")){
    //         return true;
    //     }
    //     alert($(this)[0].tagName)
    //     alert($(this).find("input:checked").length)
    //     if($(this).find("input:checked").length && $(".next-step-item:visible").length == 1){
    //         return false;
    //     }
    //     return true;
    // });



</script>